/**
 * 这里是uni-app内置的常用样式变量
 *
 * uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
 * 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
 *
 */

/**
 * 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
 *
 * 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
 */

/* 颜色变量 */

/* 行为相关颜色 */
$uni-color-primary: #007aff;
$uni-color-success: #4cd964;
$uni-color-warning: #f0ad4e;
$uni-color-error: #dd524d;

/* 文字基本颜色 */
$uni-text-color: #333; // 基本色
$uni-text-color-inverse: #fff; // 反色
$uni-text-color-grey: #999; // 辅助灰色，如加载更多的提示信息
$uni-text-color-placeholder: #808080;
$uni-text-color-disable: #c0c0c0;

/* 背景颜色 */
$uni-bg-color: #fff;
$uni-bg-color-grey: #f8f8f8;
$uni-bg-color-hover: #f1f1f1; // 点击状态颜色
$uni-bg-color-mask: rgba(0, 0, 0, 0.4); // 遮罩颜色

/* 边框颜色 */
$uni-border-color: #c8c7cc;

/* 尺寸变量 */

/* 文字尺寸 */
$uni-font-size-sm: 12rpx;
$uni-font-size-base: 14rpx;
$uni-font-size-lg: 16;

/* 图片尺寸 */
$uni-img-size-sm: 20rpx;
$uni-img-size-base: 26rpx;
$uni-img-size-lg: 40rpx;

/* Border Radius */
$uni-border-radius-sm: 2rpx;
$uni-border-radius-base: 3rpx;
$uni-border-radius-lg: 6rpx;
$uni-border-radius-circle: 50%;

/* 水平间距 */
$uni-spacing-row-sm: 5rpx;
$uni-spacing-row-base: 10rpx;
$uni-spacing-row-lg: 15rpx;

/* 垂直间距 */
$uni-spacing-col-sm: 4rpx;
$uni-spacing-col-base: 8rpx;
$uni-spacing-col-lg: 12rpx;

/* 透明度 */
$uni-opacity-disabled: 0.3; // 组件禁用态的透明度

/* 文章场景相关 */
$uni-color-title: #2c405a; // 文章标题颜色
$uni-font-size-title: 20rpx;
$uni-color-subtitle: #555; // 二级标题颜色
$uni-font-size-subtitle: 18rpx;
$uni-color-paragraph: #3f536e; // 文章段落颜色
$uni-font-size-paragraph: 15rpx;

/* 自定义 */
$shop-color: #b50e03;


/* 页面背景色 */
$uni-page-bg: #F6F6F6;
/* 颜色变量 */
$uni-color-white: #ffffff;
$uni-color-black: #000000;
$uni-color-default: #323233; //文字色，指主文字1
$uni-color-secondary: #646464; //文字色，指主文字2
$uni-color-info: #999999;
//$uni-color-secondary: #ff8c4d;
//$uni-color-primary: #EB441F;  //主色
$uni-color-primary: #DE3A2E; //主色
$uni-color-warning: #DE3A2E;
$uni-color-success: #07C160;
$uni-color-error: #EB441F;

/* 弱色 */
$uni-color-primary-light-1: mix($uni-color-white, $uni-color-primary, 10%);
$uni-color-primary-light-2: mix($uni-color-white, $uni-color-primary, 20%);
$uni-color-primary-light-3: mix($uni-color-white, $uni-color-primary, 30%);
$uni-color-primary-light-4: mix($uni-color-white, $uni-color-primary, 40%);
$uni-color-primary-light-5: mix($uni-color-white, $uni-color-primary, 50%);
$uni-color-primary-light-6: mix($uni-color-white, $uni-color-primary, 50%);
$uni-color-primary-light-7: mix($uni-color-white, $uni-color-primary, 60%);
$uni-color-primary-light-8: mix($uni-color-white, $uni-color-primary, 70%);
$uni-color-primary-light-9: mix($uni-color-white, $uni-color-primary, 90%);

$uni-color-success-light-1: mix($uni-color-white, $uni-color-success, 10%);
$uni-color-success-light-2: mix($uni-color-white, $uni-color-success, 20%);
$uni-color-success-light-3: mix($uni-color-white, $uni-color-success, 30%);
$uni-color-success-light-4: mix($uni-color-white, $uni-color-success, 30%);
$uni-color-success-light-5: mix($uni-color-white, $uni-color-success, 50%);
$uni-color-success-light-6: mix($uni-color-white, $uni-color-success, 60%);
$uni-color-success-light-7: mix($uni-color-white, $uni-color-success, 70%);
$uni-color-success-light-8: mix($uni-color-white, $uni-color-success, 80%);
$uni-color-success-light-9: mix($uni-color-white, $uni-color-success, 90%);

$uni-color-warning-light-1: mix($uni-color-white, $uni-color-warning, 10%);
$uni-color-warning-light-2: mix($uni-color-white, $uni-color-warning, 20%);
$uni-color-warning-light-3: mix($uni-color-white, $uni-color-warning, 30%);
$uni-color-warning-light-4: mix($uni-color-white, $uni-color-warning, 30%);
$uni-color-warning-light-5: mix($uni-color-white, $uni-color-warning, 50%);
$uni-color-warning-light-6: mix($uni-color-white, $uni-color-warning, 60%);
$uni-color-warning-light-7: mix($uni-color-white, $uni-color-warning, 70%);
$uni-color-warning-light-8: mix($uni-color-white, $uni-color-warning, 80%);
$uni-color-warning-light-9: mix($uni-color-white, $uni-color-warning, 90%);

$uni-color-error-light-1: mix($uni-color-white, $uni-color-error, 10%);
$uni-color-error-light-2: mix($uni-color-white, $uni-color-error, 20%);
$uni-color-error-light-3: mix($uni-color-white, $uni-color-error, 30%);
$uni-color-error-light-4: mix($uni-color-white, $uni-color-error, 30%);
$uni-color-error-light-5: mix($uni-color-white, $uni-color-error, 50%);
$uni-color-error-light-6: mix($uni-color-white, $uni-color-error, 60%);
$uni-color-error-light-7: mix($uni-color-white, $uni-color-error, 70%);
$uni-color-error-light-8: mix($uni-color-white, $uni-color-error, 80%);
$uni-color-error-light-9: mix($uni-color-white, $uni-color-error, 90%);

$uni-color-info-light-1: mix($uni-color-white, $uni-color-info, 10%);
$uni-color-info-light-2: mix($uni-color-white, $uni-color-info, 20%);
$uni-color-info-light-3: mix($uni-color-white, $uni-color-info, 30%);
$uni-color-info-light-4: mix($uni-color-white, $uni-color-info, 30%);
$uni-color-info-light-5: mix($uni-color-white, $uni-color-info, 50%);
$uni-color-info-light-6: mix($uni-color-white, $uni-color-info, 60%);
$uni-color-info-light-7: mix($uni-color-white, $uni-color-info, 70%);
$uni-color-info-light-8: mix($uni-color-white, $uni-color-info, 80%);
$uni-color-info-light-9: mix($uni-color-white, $uni-color-info, 90%);


/* 文字基本颜色 */

$uni-text-color: #000; //基本色
$uni-text-color-inverse: #fff; //反色
$uni-text-color-grey: #999; //辅助灰色，如加载更多的提示信息
$uni-text-color-placeholder: #666;
$uni-text-color-disable: #CCCCCC; //指 disable、提示文字等
$uni-text-color-message: #ED6A0C; //通知消息字体颜色
$uni-text-color-assist: #FAAB0C; //辅助色
$uni-text-color-link: #5A81BB; //链接色
$uni-text-color-link: #999999; //文字色，指辅助、说明文字


/* 背景颜色 */
$uni-bg-color: #F7F8FA;
$uni-bg-color-grey: #F2F3F5;
$uni-bg-color-message: #FFFBE8; //通知消息背景色
$uni-bg-color-hover: #f1f1f1; //点击状态颜色
$uni-bg-color-mask: rgba(0, 0, 0, 0.4); //遮罩颜色
$uni-bg-color-active: mix($uni-color-white, $uni-bg-color-grey, 50%);

/* 边框颜色 */
$uni-border-color: #EBEDF0; //线色1
$uni-border-color1: #DCDEE0; //线色2

/* 尺寸变量 */

/* 文字尺寸 */
$uni-font-size-mini: 24rpx;
$uni-font-size-sm: 26rpx;
$uni-font-size-base: 28rpx;
$uni-font-size-lg: 34rpx;
$uni-font-size-title: 40rpx; //仅用于数字/常规标题
$uni-font-size-tag: 20rpx; //非常用字号，如标签

/* 高度尺寸 */
$uni-height-size-mini: 40rpx;
$uni-height-size-sm: 60rpx;
$uni-height-size-base: 88rpx;
$uni-height-size-lg: 100rpx;
$uni-height-size-title: 120rpx; //仅用于数字/常规标题
$uni-height-size-tag: 20rpx; //非常用字号，如标签

//按钮高度尺寸
$uni-button-height-size-mini: 32rpx;
$uni-button-height-size-sm: 48rpx;
$uni-button-height-size-base: 64rpx;
$uni-button-height-size-lg: 88rpx;

/* Border Radius */
$uni-border-radius-sm: 5rpx;
$uni-border-radius-base: 15rpx;
$uni-border-radius-lg: 25rpx;
$uni-border-radius-circle: 50%;
